<template>
		<view>
	
			<view class="system_content">
					<view class="system-time">12:00</view>
					<view class="system-list"  @click="handleMsgInfo"> 
							<view class="syslist-title">
									<view class="systitle-txt">这是一条系统消息</view>
									<view class="sysinfo-txt">查看详情</view>
									<image src="/static/image/find/right.png" mode="" class="sys-icon"></image>
							</view>
							<image src="/static/image/message/system-bigtu.png"  class="sysbigimg" mode=""></image>
						
					</view>
			</view>
			
			<view class="system_content">
					<view class="system-time">10:10</view>
					<view class="system-list"> 
							<view class="syslist-title">
									<view class="systitle-txt">这是一条系统消息</view>
									<view class="sysinfo-txt">查看详情</view>
									<image src="/static/image/find/right.png" mode="" class="sys-icon"></image>
							</view>
							<image src="/static/image/message/system-bigtu.png" class="sysbigimg" mode=""></image>
						
					</view>
			</view>
			<view class="system_content">
					<view class="system-time">08:10</view>
					<view class="system-list"> 
							<view class="syslist-title">
									<view class="systitle-txt">这是一条系统消息</view>
									<view class="sysinfo-txt">查看详情</view>
									<image src="/static/image/find/right.png" mode="" class="sys-icon"></image>
							</view>
							<image src="/static/image/message/system-bigtu.png" class="sysbigimg" mode=""></image>
						
					</view>
			</view>

			
		</view>
	
	
	
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
		handleMsgInfo(){
				this.$helper.to('/pages/tabBar/message/systemInfo')
		},
		}
	}
</script>

<style   scoped lang="scss">
	page{
		background-color: #F8F8F8;
	}
	
	.system_content{
		margin:0 30rpx;
		.system-time{
			text-align: center;
			color:#999;
			font-size: 28rpx;
			margin:30rpx 0;
		}
		.system-list{
			width:690rpx;
			height:502rpx;
			margin:0 auto;
			border-radius: 16rpx;
			background: #fff;
		}
		.syslist-title{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding:30rpx;
		}
		.systitle-txt{
			font-size: 32rpx;
			color:#000;
			width:500rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.sysinfo-txt{
			font-size: 24rpx;
			color:#999;
		}
		.sys-icon{
			width:12rpx;
			height:22rpx;
			margin-left:12rpx;
			margin-top:2rpx;
		}
		.sysbigimg{
			width:630rpx;
			height:380rpx;
			border-radius: 16rpx;
			display: flex;
	   	margin:0 auto;
		}
	}
	
	
</style>